import { defineComponent } from 'vue'
import { NModal } from 'naive-ui'
import styles from '../index.module.scss'

const UDFDetailModal = defineComponent({
  name: 'UDFDetailModal',
  props: {
    showModal: {
      type: Boolean,
      default: false
    },
    udfDefined: {
      type: Object,
      required: true
    }
  },
  emits: ['modalShowChange'],
  methods: {
    onCloseClick() {
      this.$emit('modalShowChange', false)
    }
  },
  render() {
    return (
      <NModal
        show={this.showModal}
        mask-closable={false}
        style='width: 600px'
        title={window.$t('taskManage.udfDetail')}
        bordered={false}
        size='huge'
        preset='dialog'
        onClose={this.onCloseClick}
      >
        <table>
          <tbody class={styles.tbody}>
            <tr>
              <td>{window.$t('taskManage.udfName')}&nbsp;&nbsp;</td>
              <td>{this.udfDefined.name}</td>
            </tr>
            <tr>
              <td>{window.$t('common.description')}&nbsp;&nbsp;</td>
              <td>{this.udfDefined.description}</td>
            </tr>
            <tr>
              <td>{window.$t('dataManage.datasourceType')}&nbsp;&nbsp;</td>
              <td>{this.udfDefined.dbType}</td>
            </tr>
            <tr>
              <td>{window.$t('taskManage.funcName')}&nbsp;&nbsp;</td>
              <td>{this.udfDefined.funcName}</td>
            </tr>
            <tr>
              <td>{window.$t('taskManage.className')}&nbsp;&nbsp;</td>
              <td>{this.udfDefined.className}</td>
            </tr>
            <tr>
              <td>{window.$t('taskManage.jarResource')}&nbsp;&nbsp;</td>
              <td>{this.udfDefined.resourceName}</td>
            </tr>
            <tr>
              <td>{window.$t('taskManage.creator')}&nbsp;&nbsp;</td>
              <td>{this.udfDefined.creator}</td>
            </tr>
            <tr>
              <td>{window.$t('common.createTime')}&nbsp;&nbsp;</td>
              <td>{this.udfDefined.createTime}</td>
            </tr>
            <tr>
              <td>{window.$t('common.updateTime')}&nbsp;&nbsp;</td>
              <td>{this.udfDefined.updateTime}</td>
            </tr>
          </tbody>
        </table>
      </NModal>
    )
  }
})

export default UDFDetailModal
